<template>
  <div>
    <!-- <nuxt :keep-alive='viewCache' :keepAliveProps="{include: includeArr}"/> -->
    <nuxt keep-alive/>
  </div>
</template>

<script>
export default {
  // 组件
  components: {},
  // props 可以是数组或对象，用于接收来自父组件的数据
  // props 可以是简单的数组，或者使用对象作为替代，对象允许配置高级选项，如类型检测、自定义校验和设置默认值。
  props: {
    // page: {
    //   type: Number,
    //   required: true,
    //   default: 1,
    // },
    // page: {
    //   type: [Number, String],
    //   default: () => 1,
    // },
  },
  // Vue 实例的数据对象。Vue 将会递归将 data 的属性转换为 getter/setter，从而让 data 的属性能够响应数据变化
  data() {
    return {
      // a: 1
      // cache: false,
      // includeArr: ['list-name-1', 'list-name-2'] // 组件的 name
    };
  },
  // 计算属性
  // 计算属性将被混入到 Vue 实例中。所有 getter 和 setter 的 this 上下文自动地绑定为 Vue 实例。
  // 注意如果你为一个计算属性使用了箭头函数，则 this 不会指向这个组件的实例，不过你仍然可以将其实例作为函数的第一个参数来访问。
  // 计算属性的结果会被缓存，除非依赖的响应式属性变化才会重新计算。注意，如果某个依赖 (比如非响应式属性) 在该实例范畴之外，则计算属性是不会被更新的。
  computed: {},
  // 观察属性
  // 一个对象，键是需要观察的表达式，值是对应回调函数。值也可以是方法名，或者包含选项的对象。
  // Vue 实例将会在实例化时调用 $watch()，遍历 watch 对象的每一个属性。
  watch: {
  // '$route': function(_new, _old) {
  //     if (_old) {
  //       this.cache = true;
  //     } else {
  //       this.cache = false;
  //     }
  //   }
  },
  // 实例初始化之后
  // 数据观测 (data observer) 和 event/watcher 事件配置之前被调用。
  beforeCreate() {},
  // 实例初始化完成
  // 实例已完成以下的配置：数据观测 (data observer)，属性和方法的运算，watch/event 事件回调。然而，挂载阶段还没开始，$el 属性目前不可见。
  created() {},
  // 挂载开始之前 相关的 render 函数首次被调用
  beforeMount() {},
  // 挂载完成
  // 该钩子在服务器端渲染期间不被调用
  // mounted 不会承诺所有的子组件也都一起被挂载
  // 如果你希望等到整个视图都渲染完毕 可以用 vm.$nextTick 替换掉 mounted
  mounted() {
  },
  // keep-alive 组件激活时调用。
  // 该钩子在服务器端渲染期间不被调用。
  activated() {},
  // keep-alive 组件停用时调用。
  // 该钩子在服务器端渲染期间不被调用。
  deactivated() {},
  // 数据更新时调用
  // 该钩子在服务器端渲染期间不被调用 因为只有初次渲染会在服务端进行
  // 发生在虚拟 DOM 打补丁之前。这里适合在更新之前访问现有的 DOM，比如手动移除已添加的事件监听器。
  beforeUpdate() {},
  // 数据更新完成
  // 数据更改 导致的虚拟 DOM 重新渲染和打补丁，在这之后会调用该钩子
  // 所以你现在可以执行依赖于 DOM 的操作。然而在大多数情况下，你应该避免在此期间更改状态。
  // 如果要相应状态改变，通常最好使用计算属性或 watcher 取而代之。
  updated() {},
  // 实例销毁之前调用
  // 该钩子在服务器端渲染期间不被调用
  beforeDestroy() {},
  // Vue 实例销毁后调用。调用后，Vue 实例指示的所有东西都会解绑定，所有的事件监听器会被移除，所有的子实例也会被销毁。
  // 该钩子在服务器端渲染期间不被调用
  // destroyed() { },
  // 当捕获一个来自子孙组件的错误时被调用。此钩子会收到三个参数：错误对象、发生错误的组件实例以及一个包含错误来源信息的字符串。
  // 此钩子可以返回 false 以阻止该错误继续向上传播。
  // errorCaptured(err, vm, info) { },
  // 方法
  methods: {}
};
</script>

<style scoped>

</style>
